<template>
  <div class="menuList">
    <!-- 烘焙 -->
    <ul v-if="type1 === 'bake'">
      <div v-for="(item, index) in menulist1" :key="index">
        <!-- 二级分类 -->
        <h3>{{ item.type2 }}</h3>
        <!-- 三级分类 -->
        <div class="list-item">
          <router-link
            v-for="(it, id) in item.list"
            :key="id"
            :to="{ name: 'search', params: { Keywords: it.name } }"
          >
            <img :src="it.img" />
            <p>{{ it.name }}</p>
          </router-link>
        </div>
      </div>
    </ul>
    <!-- 甜品饮料 -->
    <ul v-if="type1 === 'drink'">
      <div v-for="(item, index) in menulist2" :key="index">
        <!-- 二级分类 -->
        <h3>{{ item.type2 }}</h3>
        <!-- 三级分类 -->
        <div class="list-item">
          <router-link
            v-for="(it, id) in item.list"
            :key="id"
            :to="{ name: 'search', params: { type3: it.name } }"
          >
            <img :src="it.img" />
            <p>{{ it.name }}</p>
          </router-link>
        </div>
      </div>
    </ul>
    <!-- 肉类 -->
    <ul v-if="type1 === 'meat'">
      <div v-for="(item, index) in menulist3" :key="index">
        <!-- 二级分类 -->
        <h3>{{ item.type2 }}</h3>
        <!-- 三级分类 -->
        <div class="list-item">
          <router-link
            v-for="(it, id) in item.list"
            :key="id"
            :to="{ name: 'search', params: { type3: it.name } }"
          >
            <img :src="it.img" />
            <p>{{ it.name }}</p>
          </router-link>
        </div>
      </div>
    </ul>
    <!-- 蔬菜 -->
    <ul v-if="type1 === 'vegetable'">
      <div v-for="(item, index) in menulist4" :key="index">
        <!-- 二级分类 -->
        <h3>{{ item.type2 }}</h3>
        <!-- 三级分类 -->
        <div class="list-item">
          <router-link
            v-for="(it, id) in item.list"
            :key="id"
            :to="{ name: 'search', params: { type3: it.name } }"
          >
            <img :src="it.img" />
            <p>{{ it.name }}</p>
          </router-link>
        </div>
      </div>
    </ul>
    <!-- 水果 -->
    <ul v-if="type1 === 'fruit'">
      <div v-for="(item, index) in menulist5" :key="index">
        <!-- 二级分类 -->
        <h3>{{ item.type2 }}</h3>
        <!-- 三级分类 -->
        <div class="list-item">
          <router-link
            v-for="(it, id) in item.list"
            :key="id"
            :to="{ name: 'search', params: { type3: it.name } }"
          >
            <img :src="it.img" />
            <p>{{ it.name }}</p>
          </router-link>
        </div>
      </div>
    </ul>
    <!-- 煲汤 -->
    <ul v-if="type1 === 'soup'">
      <div v-for="(item, index) in menulist6" :key="index">
        <!-- 二级分类 -->
        <h3>{{ item.type2 }}</h3>
        <!-- 三级分类 -->
        <div class="list-item">
          <router-link
            v-for="(it, id) in item.list"
            :key="id"
            :to="{ name: 'search', params: { type3: it.name } }"
          >
            <img :src="it.img" />
            <p>{{ it.name }}</p>
          </router-link>
        </div>
      </div>
    </ul>
    <!-- 水产 -->
    <ul v-if="type1 === 'fish'">
      <div v-for="(item, index) in menulist7" :key="index">
        <!-- 二级分类 -->
        <h3>{{ item.type2 }}</h3>
        <!-- 三级分类 -->
        <div class="list-item">
          <router-link
            v-for="(it, id) in item.list"
            :key="id"
            :to="{ name: 'search', params: { type3: it.name } }"
          >
            <img :src="it.img" />
            <p>{{ it.name }}</p>
          </router-link>
        </div>
      </div>
    </ul>
    <!-- 豆制品 -->
    <ul v-if="type1 === 'bean'">
      <div v-for="(item, index) in menulist1" :key="index">
        <!-- 二级分类 -->
        <h3>{{ item.type2 }}</h3>
        <!-- 三级分类 -->
        <div class="list-item">
          <router-link
            v-for="(it, id) in item.list"
            :key="id"
            :to="{ name: 'search', params: { type3: it.name } }"
          >
            <img :src="it.img" />
            <p>{{ it.name }}</p>
          </router-link>
        </div>
      </div>
    </ul>
    <!-- 米面 -->
    <ul v-if="type1 === 'mainfood'">
      <div v-for="(item, index) in menulist1" :key="index">
        <!-- 二级分类 -->
        <h3>{{ item.type2 }}</h3>
        <!-- 三级分类 -->
        <div class="list-item">
          <router-link
            v-for="(it, id) in item.list"
            :key="id"
            :to="{ name: 'search', params: { type3: it.name } }"
          >
            <img :src="it.img" />
            <p>{{ it.name }}</p>
          </router-link>
        </div>
      </div>
    </ul>
    <!-- 腌制食品 -->
    <ul v-if="type1 === 'pickle'">
      <div v-for="(item, index) in menulist1" :key="index">
        <!-- 二级分类 -->
        <h3>{{ item.type2 }}</h3>
        <!-- 三级分类 -->
        <div class="list-item">
          <router-link
            v-for="(it, id) in item.list"
            :key="id"
            :to="{ name: 'search', params: { type3: it.name } }"
          >
            <img :src="it.img" />
            <p>{{ it.name }}</p>
          </router-link>
        </div>
      </div>
    </ul>
    <!-- 节日 -->
    <ul v-if="type1 === 'holiday'">
      <div v-for="(item, index) in menulist1" :key="index">
        <!-- 二级分类 -->
        <h3>{{ item.type2 }}</h3>
        <!-- 三级分类 -->
        <div class="list-item">
          <router-link
            v-for="(it, id) in item.list"
            :key="id"
            :to="{ name: 'search', params: { type3: it.name } }"
          >
            <img :src="it.img" />
            <p>{{ it.name }}</p>
          </router-link>
        </div>
      </div>
    </ul>
  </div>
</template>

<script>
export default {
  data() {
    return {
      menulist1: [
        {
          type2: "蛋糕",
          list: [
            {
              name: "纸杯蛋糕",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1164.png",
            },
            {
              name: "慕斯蛋糕",
              img: "https://img2.baidu.com/it/u=3193299361,1653420950&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=666",
            },
            {
              name: "芝士蛋糕",
              img: "https://img2.baidu.com/it/u=240021512,560721736&fm=253&fmt=auto&app=138&f=JPEG?w=667&h=500",
            },
            {
              name: "戚风蛋糕",
              img: "https://img1.baidu.com/it/u=2978624864,1375198287&fm=253&fmt=auto&app=138&f=JPEG?w=704&h=500",
            },
            {
              name: "冰淇淋蛋糕",
              img: "https://img0.baidu.com/it/u=1047338496,1167707363&fm=253&fmt=auto&app=138&f=JPEG?w=667&h=500",
            },
            {
              name: "巴斯克蛋糕",
              img: "https://img1.baidu.com/it/u=523088769,2745020140&fm=253&fmt=auto&app=138&f=JPEG?w=660&h=446",
            },
          ],
        },
        {
          type2: "面包",
          list: [
            {
              name: "全麦面包",
              img: "https://img2.baidu.com/it/u=191323729,1670200226&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500",
            },
            {
              name: "法棍",
              img: "https://img0.baidu.com/it/u=1129197755,2079573792&fm=253&fmt=auto&app=120&f=JPEG?w=1063&h=800",
            },
            {
              name: "夹心面包",
              img: "https://img2.baidu.com/it/u=3293256929,2024545587&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=333",
            },
            {
              name: "手撕面包",
              img: "https://img1.baidu.com/it/u=2765008124,1534578213&fm=253&fmt=auto&app=138&f=JPEG?w=701&h=500",
            },
            {
              name: "披萨面包",
              img: "https://img0.baidu.com/it/u=4093005080,524277680&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500",
            },
            {
              name: "吐司面包",
              img: "https://img2.baidu.com/it/u=1307714704,3022917806&fm=253&fmt=auto&app=120&f=JPEG?w=1200&h=800",
            },
          ],
        },
        {
          type2: "饼",
          list: [
            {
              name: "曲奇饼",
              img: "https://img1.baidu.com/it/u=3011524369,1910095161&fm=253&fmt=auto&app=138&f=JPEG?w=453&h=300",
            },
            {
              name: "蛋卷",
              img: "https://img2.baidu.com/it/u=2834204119,4018290297&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=632",
            },
            {
              name: "牛奶棒",
              img: "https://img0.baidu.com/it/u=1172789657,1480155252&fm=253&fmt=auto&app=138&f=JPEG?w=350&h=350",
            },
            {
              name: "桃酥",
              img: "https://img1.baidu.com/it/u=4218178846,3452070390&fm=253&fmt=auto&app=138&f=JPEG?w=750&h=500",
            },
            {
              name: "夹心饼干",
              img: "https://img1.baidu.com/it/u=575384558,4014126767&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=362",
            },
            {
              name: "威化饼",
              img: "https://img1.baidu.com/it/u=539108139,2888548060&fm=253&fmt=auto&app=138&f=JPEG?w=706&h=500",
            },
          ],
        },
      ],
      menulist2: [
        {
          type2: "甜品",
          list: [
            {
              name: "糖水",
              img: "https://img0.baidu.com/it/u=4020346817,2897793186&fm=253&fmt=auto&app=120&f=JPEG?w=1080&h=720",
            },
            {
              name: "冰淇淋",
              img: "https://img2.baidu.com/it/u=2130139207,977536834&fm=253&fmt=auto&app=138&f=JPEG?w=557&h=500",
            },
            {
              name: "泡芙",
              img: "https://img1.baidu.com/it/u=1632142022,4004254045&fm=253&fmt=auto&app=120&f=JPEG?w=1067&h=800",
            },
            {
              name: "布丁",
              img: "https://img1.baidu.com/it/u=795890089,2217847778&fm=253&fmt=auto&app=138&f=JPEG?w=700&h=463",
            },
            {
              name: "提拉米苏",
              img: "https://img1.baidu.com/it/u=3193168920,4026410212&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=750",
            },
            {
              name: "果酱",
              img: "https://img1.baidu.com/it/u=603740012,726566544&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=340",
            },
          ],
        },
        {
          type2: "饮料",
          list: [
            {
              name: "碳酸饮料",
              img: "https://img0.baidu.com/it/u=951747976,1288628508&fm=253&fmt=auto&app=138&f=JPEG?w=585&h=408",
            },
            {
              name: "果蔬汁",
              img: "https://ns-strategy.cdn.bcebos.com/ns-strategy/upload/fc_big_pic/part-00669-375.jpg",
            },
            {
              name: "蛋白饮料",
              img: "https://img0.baidu.com/it/u=2617879643,910903577&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500",
            },
            {
              name: "茶饮",
              img: "https://img0.baidu.com/it/u=2800463059,3500866152&fm=253&fmt=auto&app=138&f=JPEG?w=889&h=500",
            },
            {
              name: "咖啡",
              img: "https://img1.baidu.com/it/u=3937213861,3981946759&fm=253&fmt=auto&app=138&f=JPEG?w=667&h=500",
            },
            {
              name: "酒饮",
              img: "https://img1.baidu.com/it/u=1882535705,46756565&fm=253&fmt=auto&app=120&f=JPEG?w=1120&h=800",
            },
          ],
        },
      ],
      menulist3: [
        {
          type2: "鸡肉",
          list: [
            {
              name: "鸡肉",
              img: "https://img1.baidu.com/it/u=1691473020,3768533940&fm=253&fmt=auto&app=138&f=JPEG?w=610&h=425",
            },
            {
              name: "鸡胸肉",
              img: "https://img0.baidu.com/it/u=3261749441,703648409&fm=253&fmt=auto&app=138&f=PNG?w=711&h=500",
            },
            {
              name: "鸡爪",
              img: "https://img2.baidu.com/it/u=576301218,3402864296&fm=253&fmt=auto&app=120&f=PNG?w=969&h=647",
            },
            {
              name: "鸡翅中",
              img: "https://img1.baidu.com/it/u=1228681195,1803061708&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500",
            },
            {
              name: "鸡翅尖",
              img: "https://img2.baidu.com/it/u=2784519577,325029831&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500",
            },
            {
              name: "鸡腿",
              img: "https://img1.baidu.com/it/u=590022210,2628048736&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=751",
            },
          ],
        },
        {
          type2: "鱼肉",
          list: [
            {
              name: "鱼头",
              img: "https://img0.baidu.com/it/u=4037563908,1520064813&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=667",
            },
            {
              name: "鱼肉",
              img: "https://img0.baidu.com/it/u=1692292586,4222377328&fm=253&fmt=auto&app=120&f=JPEG?w=670&h=447",
            },
            {
              name: "鱼尾",
              img: "https://img2.baidu.com/it/u=2541753720,2766999104&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500",
            },
          ],
        },
        {
          type2: "牛肉",
          list: [
            {
              name: "牛头",
              img: "https://img2.baidu.com/it/u=1458522633,3436259194&fm=253&fmt=auto&app=120&f=JPEG?w=800&h=500",
            },
            {
              name: "里脊",
              img: "https://img2.baidu.com/it/u=1385637564,2080364281&fm=253&fmt=auto&app=138&f=JPEG?w=780&h=439",
            },
            {
              name: "牛排",
              img: "https://img0.baidu.com/it/u=3530824191,4189562098&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=403",
            },
            {
              name: "牛舌",
              img: "https://img0.baidu.com/it/u=3481015032,3009969251&fm=253&fmt=auto&app=138&f=JPEG?w=889&h=500",
            },
            {
              name: "排骨",
              img: "https://img1.baidu.com/it/u=1265955423,4139992019&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=750",
            },
            {
              name: "牛杂",
              img: "https://img2.baidu.com/it/u=505246916,2995324228&fm=253&fmt=auto&app=138&f=JPEG?w=667&h=500",
            },
          ],
        },
        {
          type2: "羊肉",
          list: [
            {
              name: "羊蝎子",
              img: "https://img1.baidu.com/it/u=2442644103,3983841000&fm=253&fmt=auto&app=138&f=JPEG?w=333&h=500",
            },
            {
              name: "羊排",
              img: "https://img1.baidu.com/it/u=2912947156,1140757529&fm=253&fmt=auto&app=138&f=JPEG?w=667&h=500",
            },
            {
              name: "羊肉",
              img: "https://img2.baidu.com/it/u=1825061600,1914278652&fm=253&fmt=auto&app=138&f=JPEG?w=750&h=500",
            },
          ],
        },
      ],
      menulist4: [
        {
          type2: "蔬菜",
          list: [
            {
              name: "西红柿",
              img: "https://img1.baidu.com/it/u=1052833325,2372985842&fm=253&fmt=auto&app=138&f=JPEG?w=526&h=500",
            },
            {
              name: "土豆",
              img: "https://img1.baidu.com/it/u=161617254,4123470857&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=503",
            },
            {
              name: "茄子",
              img: "https://img1.baidu.com/it/u=4126755707,2065783739&fm=253&fmt=auto&app=138&f=JPEG?w=889&h=500",
            },
            {
              name: "青菜",
              img: "https://img2.baidu.com/it/u=3512786709,4035276665&fm=253&fmt=auto&app=138&f=JPEG?w=889&h=500",
            },
            {
              name: "莲藕",
              img: "https://img0.baidu.com/it/u=1252331250,1414890082&fm=253&fmt=auto&app=138&f=JPEG?w=892&h=500",
            },
            {
              name: "番薯",
              img: "https://img0.baidu.com/it/u=1219775359,1824332907&fm=253&fmt=auto&app=138&f=JPEG?w=667&h=500",
            },
            {
              name: "芋头",
              img: "https://img2.baidu.com/it/u=3581917263,2245092183&fm=253&fmt=auto&app=138&f=JPEG?w=720&h=440",
            },
            {
              name: "菇",
              img: "https://img2.baidu.com/it/u=710734220,3660703732&fm=253&fmt=auto?w=1147&h=800",
            },
            {
              name: "豆",
              img: "https://img2.baidu.com/it/u=268301371,1013121953&fm=253&fmt=auto&app=138&f=JPEG?w=750&h=500",
            },
          ],
        },
      ],
      menulist5: [
        {
          type2: "水果",
          list: [
            {
              name: "苹果",
              img: "https://img0.baidu.com/it/u=2263136498,514901290&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500",
            },
            {
              name: "香蕉",
              img: "https://img2.baidu.com/it/u=2964958730,2902647428&fm=253&fmt=auto&app=138&f=JPEG?w=577&h=500",
            },
            {
              name: "梨子",
              img: "https://img2.baidu.com/it/u=1360800148,3950616315&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=416",
            },
            {
              name: "西瓜",
              img: "https://img0.baidu.com/it/u=2803669539,2657348326&fm=253&fmt=auto&app=120&f=JPEG?w=1280&h=800",
            },
            {
              name: "榴莲",
              img: "https://img2.baidu.com/it/u=2012832722,3432143772&fm=253&fmt=auto&app=120&f=JPEG?w=600&h=600",
            },
            {
              name: "葡萄",
              img: "https://img1.baidu.com/it/u=3887928955,792316383&fm=253&fmt=auto&app=138&f=JPEG?w=561&h=500",
            },
            {
              name: "芒果",
              img: "https://img2.baidu.com/it/u=422585645,3229296282&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500",
            },
            {
              name: "柠檬",
              img: "https://img0.baidu.com/it/u=2632612899,1307688187&fm=253&fmt=auto&app=138&f=JPEG?w=808&h=500",
            },
            {
              name: "菠萝",
              img: "https://img0.baidu.com/it/u=651582687,767666741&fm=253&fmt=auto&app=138&f=JPEG?w=889&h=500",
            },
            {
              name: "椰子",
              img: "https://img0.baidu.com/it/u=781839744,1819166628&fm=253&fmt=auto&app=138&f=JPEG?w=700&h=500",
            },
            {
              name: "木瓜",
              img: "https://img0.baidu.com/it/u=3884380023,891081409&fm=253&fmt=auto&app=138&f=JPEG?w=530&h=500",
            },
            {
              name: "火龙果",
              img: "https://img0.baidu.com/it/u=1924626481,4043773005&fm=253&fmt=auto&app=138&f=JPEG?w=600&h=400",
            },
          ],
        },
      ],
      menulist6: [
        {
          type2: "甜汤",
          list: [
            {
              name: "绿豆沙",
              img: "https://img2.baidu.com/it/u=590668899,2472843964&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500",
            },
            {
              name: "红豆沙",
              img: "https://img2.baidu.com/it/u=4090322113,4097860985&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500",
            },
            {
              name: "芝麻糊",
              img: "https://img2.baidu.com/it/u=3476377490,3116599531&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=438",
            },
            {
              name: "雪梨银耳",
              img: "https://img0.baidu.com/it/u=2135773055,2711293553&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500",
            },
            {
              name: "木瓜炖牛奶",
              img: "https://img1.baidu.com/it/u=1704312660,2950703877&fm=253&fmt=auto&app=138&f=JPEG?w=582&h=500",
            },
            {
              name: "红枣枸杞银耳羹",
              img: "https://img1.baidu.com/it/u=457370424,956634816&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500",
            },
          ],
        },
        {
          type2: "咸汤",
          list: [
            {
              name: "排骨汤",
              img: "https://img0.baidu.com/it/u=681873784,213150324&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500",
            },
            {
              name: "莲藕花生猪脚汤",
              img: "https://img1.baidu.com/it/u=2436980389,1326998591&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500",
            },
            {
              name: "猪肚汤",
              img: "https://img0.baidu.com/it/u=1635217141,3984691686&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=666",
            },
            {
              name: "鱼汤",
              img: "https://img0.baidu.com/it/u=1688725570,2059311029&fm=253&fmt=auto&app=138&f=JPEG?w=750&h=500",
            },
            {
              name: "萝卜牛腩汤",
              img: "https://img2.baidu.com/it/u=3820734936,890405745&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500",
            },
            {
              name: "紫菜蛋花汤",
              img: "https://img1.baidu.com/it/u=870257010,3961357196&fm=253&fmt=auto&app=138&f=JPEG?w=667&h=500",
            },
          ],
        },
      ],
      menulist7: [
        {
          type2: "水产",
          list: [
            {
              name: "鱼",
              img: "https://img1.baidu.com/it/u=3421227804,2531204601&fm=253&fmt=auto&app=138&f=JPEG?w=610&h=405",
            },
            {
              name: "虾",
              img: "https://img0.baidu.com/it/u=3641273903,566482047&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=334",
            },
            {
              name: "蟹",
              img: "https://img0.baidu.com/it/u=2703062940,2819481540&fm=253&fmt=auto&app=138&f=JPEG?w=667&h=500",
            },
            {
              name: "贝类",
              img: "https://img1.baidu.com/it/u=1629441020,2366685883&fm=253&fmt=auto&app=138&f=JPEG?w=751&h=500",
            },
          ],
        },
      ],
      menulist8: [
        {
          type2: "豆制品",
          list: [
            {
              name: "纸杯蛋糕",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1164.png",
            },
            {
              name: "慕斯蛋糕",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1164.png",
            },
            {
              name: "芝士蛋糕",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1164.png",
            },
            {
              name: "戚风蛋糕",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1164.png",
            },
            {
              name: "冰淇淋蛋糕",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1164.png",
            },
            {
              name: "巴斯克蛋糕",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1164.png",
            },
          ],
        },
        {
          type2: "面包",
          list: [
            {
              name: "全麦面包",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1176.png",
            },
            {
              name: "法棍",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1176.png",
            },
            {
              name: "夹心面包",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1176.png",
            },
            {
              name: "手撕面包",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1176.png",
            },
            {
              name: "披萨面包",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1176.png",
            },
            {
              name: "多士面包",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1176.png",
            },
          ],
        },
        {
          type2: "饼",
          list: [
            {
              name: "曲奇饼",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1170.png",
            },
            {
              name: "蛋卷",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1170.png",
            },
            {
              name: "牛奶棒",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1170.png",
            },
            {
              name: "桃酥",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1170.png",
            },
            {
              name: "夹心饼干",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1170.png",
            },
            {
              name: "威化饼",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1170.png",
            },
          ],
        },
      ],
      menulist9: [
        {
          type2: "蛋糕",
          list: [
            {
              name: "纸杯蛋糕",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1164.png",
            },
            {
              name: "慕斯蛋糕",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1164.png",
            },
            {
              name: "芝士蛋糕",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1164.png",
            },
            {
              name: "戚风蛋糕",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1164.png",
            },
            {
              name: "冰淇淋蛋糕",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1164.png",
            },
            {
              name: "巴斯克蛋糕",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1164.png",
            },
          ],
        },
        {
          type2: "面包",
          list: [
            {
              name: "全麦面包",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1176.png",
            },
            {
              name: "法棍",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1176.png",
            },
            {
              name: "夹心面包",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1176.png",
            },
            {
              name: "手撕面包",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1176.png",
            },
            {
              name: "披萨面包",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1176.png",
            },
            {
              name: "多士面包",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1176.png",
            },
          ],
        },
        {
          type2: "饼",
          list: [
            {
              name: "曲奇饼",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1170.png",
            },
            {
              name: "蛋卷",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1170.png",
            },
            {
              name: "牛奶棒",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1170.png",
            },
            {
              name: "桃酥",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1170.png",
            },
            {
              name: "夹心饼干",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1170.png",
            },
            {
              name: "威化饼",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1170.png",
            },
          ],
        },
      ],
      menulist10: [
        {
          type2: "蛋糕",
          list: [
            {
              name: "纸杯蛋糕",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1164.png",
            },
            {
              name: "慕斯蛋糕",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1164.png",
            },
            {
              name: "芝士蛋糕",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1164.png",
            },
            {
              name: "戚风蛋糕",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1164.png",
            },
            {
              name: "冰淇淋蛋糕",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1164.png",
            },
            {
              name: "巴斯克蛋糕",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1164.png",
            },
          ],
        },
        {
          type2: "面包",
          list: [
            {
              name: "全麦面包",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1176.png",
            },
            {
              name: "法棍",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1176.png",
            },
            {
              name: "夹心面包",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1176.png",
            },
            {
              name: "手撕面包",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1176.png",
            },
            {
              name: "披萨面包",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1176.png",
            },
            {
              name: "多士面包",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1176.png",
            },
          ],
        },
        {
          type2: "饼",
          list: [
            {
              name: "曲奇饼",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1170.png",
            },
            {
              name: "蛋卷",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1170.png",
            },
            {
              name: "牛奶棒",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1170.png",
            },
            {
              name: "桃酥",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1170.png",
            },
            {
              name: "夹心饼干",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1170.png",
            },
            {
              name: "威化饼",
              img: "https://cdn7.axureshop.com/demo/1934191/images/%E5%88%86%E7%B1%BB/u1170.png",
            },
          ],
        },
      ],
      type1: "",
      // 上面的列表数据，应该从数据库请求得到
    };
  },
  watch: {
    "$store.state.type1": {
      handler() {
        // 从vuex中获得选择的一级分类
        this.type1 = this.$store.state.type1;
      },
      immediate: true,
    },
  },
};
</script>

<style lang="scss" scoped>
.right-list {
  flex: 1;
  height: 100%;
  overflow: auto;
  font-size: 12px;
  h3 {
    padding-left: 20px;
    &:first-child {
      padding-top: 20px;
    }
  }
  .list-item {
    margin: 10px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    text-align: center;
    cursor: pointer;
    a {
      width: 33%;
      height: 100px;
      color: #000;
      img {
        width: 70px;
        height: 70px;
        background-color: pink;
        border-radius: 5px;
      }
      p {
        line-height: 30px;
      }
    }
  }
}
</style>
